<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/sort.css">
    <title>团购网分类</title>
</head>
<body>
      <!-- 头部 -->
    <header>
       <!-- 头部内容 -->
      <div class="h_top">
         <ul>
             <li><a href="./index.html">Back</a> </li>
             <li>分类</li>
             <li>
                <select>
                    <option value="广州市">广州市</option>
                    <option value="深圳市">深圳市</option>
                    <option value="北京市">北京市</option>
                </select>
                 <!-- 三角形 -->
                <i></i>
             </li>
         </ul>
      </div>

      <!-- 轮播图 -->
      <div class="h_bt">
           <!-- 顶部 -->
          <div class="car">
          <p>
              <img src="./images/sort/美食.png" alt="">
              <span>美食</span>
          </p>
          <p>
            <img src="./images/sort/电影.png" alt="">
            <span>电影</span>
          </p>
          <p>
            <img src="./images/sort/运动.png" alt="">
            <span>运动</span>
          </p>
          <p>
            <img src="./images/sort/唱歌.png" alt="">
            <span>唱歌</span>
          </p>
        </div>

        <!-- 小圆点 -->
        <div class="dots">
            <span class="dots_active"></span>
            <span></span>
            <span></span>
            <span></span>
        </div>

      </div>

    </header>

    <!-- 内容 -->
    <main>
        <!-- 美食 -->
         <div class="fine">
             <!-- 美食标题 -->
         <div class="title">
              <p><img src="./images/sort/美食类.png" alt=""> <span>美食类</span></p>
              <p><span>更多</span><img src="./images/sort/更多.png" alt=""></p>
         </div>
         <!-- 美食图片 -->
          <div class="picture">
              <img src="./images/sort/美食类1.png" alt="">
              <img src="./images/sort/美食类2.png" alt="">
              <img src="./images/sort/美食类3.png" alt="">
              <img src="./images/sort/美食类4.png" alt="">
          </div>
         </div>
         





               <!-- 运动 -->
         <div class="run">
            <div class="title">
                <p><img src="./images/sort/运动类.png" alt=""> <span>运动类</span></p>
                <p><span>更多</span><img src="./images/sort/更多.png" alt=""></p>
           </div>
           <!-- 美食图片 -->
            <div class="picture">
                <img src="./images/sort/运动类1.png" alt="">
                <img src="./images/sort/运动类2.png" alt="">
                <img src="./images/sort/运动类3.png" alt="">
                <img src="./images/sort/运动类4.png" alt="">
            
            </div>
         </div>
         <!-- 电影 -->
         <div class="film">

         
                <div class="title">
                    <p><img src="./images/sort/电影类.png" alt=""> <span>电影类</span></p>
                    <p><span>更多</span><img src="./images/sort/更多.png" alt=""></p>
               </div>
               <!-- 美食图片 -->
                <div class="picture">
                    <img src="./images/sort/电影类1.png" alt="">
                    <img src="./images/sort/电影类2.png" alt="">
                    <img src="./images/sort/电影类1.png" alt="">
                    <img src="./images/sort/电影类2.png" alt="">
                
                
             </div>
         </div>
        
         
         

    </main>
    <!-- 底部导航栏 -->
    <nav>
        <div class="bt">
       
        <p>
           <a href="./index.html">
              <img src="./images/sort/首页.png" alt="">
              <span>首页</span>
           </a> 

        </p>
        <p>
            <a href="./sort.html">
            <img src="./images/sort/分类.png" alt="">
              <span>分类</span>
                
            </a>
        </p>
        <p>
          <a href="./find.html">
            <img src="./images/sort/发现.png" alt="">
            <span>发现</span>
             
          </a>

        </p>
        <p>
          <a href="./admin.html">
            <img src="./images/sort/我的.png" alt="">
            <span>我的</span>
            
          </a>

        </p>
    </div>

  </nav>
</body>
</html>